<script setup lang="ts">
defineProps<{
  list: any[];
}>();
</script>

<template>
  <!-- S 产品区 -->
  <div class="flex flex-wrap p-2.5">
    <a
      v-for="(item, index) in list"
      class="relative flex-none w-1/2 p-2.5"
      :href="item.href"
      target="_blank"
      :key="index"
    >
      <img :src="item.src" class="w-full" />

      <div
        class="absolute left-2/7 -translate-x-1/2 lg:bottom-1/3 bottom-1/4 text-sm lg:text-base"
      >
        <!-- <a href="#" class="product-enter">立即购买></a>
        <a :href="'#'" class="product-enter">了解详情> </a> -->
      </div>
    </a>
  </div>
  <!-- E  产品区 -->
</template>

<style lang="less">
.product-enter {
  margin-left: 14px;
  color: rgba(121, 72, 234, 1);
  text-decoration: unset;

  &:first-child {
    margin-left: 0;
  }
}
</style>
